<template>
  <TablePage>
    <template #top>
      <SearchForm
        title="服务管理"
        :keyword-search-data="[{ key: 'collector', label: '收费员名称' }]"
        :select-data="selectData"
        @search="search"
      >
        <template #extraButtons>
          <a-button class="mr-2" type="primary" ghost @click="exportScore">导出评分</a-button>
          <a-upload
            :show-upload-list="false"
            accept=".xls"
            :headers="headers"
            :action="uploadUrl"
            method="put"
            @change="uploadChange"
          >
            <a-button class="mr-2" type="primary" ghost :loading="updateBtnLoading" @click="uploadScore">
              上传评分
            </a-button>
          </a-upload>
        </template>
      </SearchForm>
    </template>
    <SlTable :columns="columns" row-key="id" :data-source="tableData" :pagination="pagination" :loading="tableLoading">
      <!-- <template #bodyCell="{ column, record }">
        
      </template> -->
    </SlTable>
  </TablePage>
</template>
<script lang="ts" setup>
import { onMounted, ref } from "vue";
import { useI18n } from "/@/locales/useI18n";
import { useCURD } from "/@/hooks/useCURD";
import { downloadFile, handleDateRowRender } from "/@/utils/common";
import { FormItemComponentType, CURDAction } from "/@/components/CURDDialog/models";
import type { FormItemData, OperItem, ShowCURDModalOptions } from "/@/components/CURDDialog/models";
import { message, TableProps, UploadChangeParam, UploadFile } from "ant-design-vue";
import { PatternKey } from "/@/utils/verify";
import { Api } from "/@/api/main/civilizedService";
import { exportReq } from "/@/api/common";
import { DEFAULT_IMG_BASE64_STR } from "/@/utils/file";
import { LabelSelectType, SelectItem } from "/@/types/components";
import { Api as csApi } from "/@/api/main/civilizedService";
import { ServiceManagementItem, TollBoothItem } from "/@/api/main/civilizedService/models";
import { SelectOptionItem } from "/@/types/antd";
import { getAuthHeaderInfo, ResponseData } from "/@/api/req";
import env from "/@/base/env";

const { t } = useI18n();
const columns = ref<TableProps<ServiceManagementItem>["columns"]>([
  {
    title: "日期",
    dataIndex: "date",
  },
  {
    title: "收费员",
    dataIndex: "collector",
  },
  {
    title: "文明用语AI评分",
    dataIndex: "term",
  },
  {
    title: "手势服务AI评分",
    dataIndex: "gesture",
  },
  {
    title: "文明用语人工评分",
    dataIndex: "termMan",
  },
  {
    title: "手势服务人工评分",
    dataIndex: "gestureMan",
  },
  {
    title: "AI综合评分",
    dataIndex: "aiAvgScore",
  },
  {
    title: "人工综合评分",
    dataIndex: "manAvgScore",
  },
  {
    title: "服务质量评分",
    dataIndex: "quality",
  },
]);
function search(model) {
  if (model.dateRange) {
    let start = model.dateRange[0];
    let end = model.dateRange[1];
    start = start.split(" ")[0] + " 00:00:00";
    end = end.split(" ")[0] + " 23:59:59";
    model.startTime = start;
    model.endTime = end;
    delete model.dateRange;
  } else if (model.dateRange === null) {
    model.startTime = null;
    model.endTime = null;
  }
  // console.log(model);
  reloadTable({ model });
}

const { pagination, tableData, tableLoading, curd, reloadTable } = useCURD<ServiceManagementItem>({
  getPageUrl: Api.serviceManagement,
});

const selectData = ref<SelectItem[]>([
  {
    label: "收费时间",
    key: "dateRange",
    selectType: LabelSelectType.rangePicker,
    props: {
      // showTime: {
      //   format: "HH:mm:ss",
      // },]]]
      showTime: false,
      format: "YYYY-MM-DD",
      valueFormat: "YYYY-MM-DD",
    },
  },
]);

onMounted(async () => {});
/**
 * 下载
 */
async function exportScore() {
  const re = await exportReq(Api.serviceManagementExport, {});
  if (re) {
    downloadFile(re, "评分列表");
  }
}
/**
 * 上传
 */
const headers = getAuthHeaderInfo();
const uploadUrl = env.baseUrl + Api.serviceManagementImport;
const updateBtnLoading = ref(false);
const uploadChange = (info: UploadChangeParam<UploadFile<ResponseData>>) => {
  // console.log("change", info);
  if (info.file.status === "uploading") {
    updateBtnLoading.value = true;
    return;
  } else if (info.file.status === "done") {
    updateBtnLoading.value = false;
    message.success("上传成功");
    reloadTable();
  } else if (info.file.status === "error") {
    updateBtnLoading.value = false;
    message.error(t("common.uploadErr"));
  }
};
function uploadScore() {}
</script>
